<template>
	<view>
		<view v-for="(item2,index2) in showList" :key='item2.id'>
			<view class="font-26 fwb near">设备编号：{{item2.machine_Code}}</view>
			<!-- 收益 -->
			<view class="card-2">
				<view v-if="startDate&&endDate">
					<view style="text-align: center;">
						<view class="card-2-price">{{item2.earnings | million}}</view>
						<view>累计收益（元）</view>
					</view>
				</view>
				<view class="flex flex-jc-sa flex-ai-c" style="text-align: center;" v-else>
					<view>
						<view class="card-2-price">{{item2.yesterday | million}}</view>
						<view>昨日收益（元）</view>
					</view>
					<view style="width: 2rpx;height: 74rpx;border: 2rpx dashed #EEEEEE;margin-top: 20rpx;">
					</view>
					<view>
						<view class="card-2-price">{{item2.duringMonth | million}}</view>
						<view>本月收益（元）</view>
					</view>
				</view>
				<view style="margin: 24rpx 24rpx;">
					<u-line color="#F6F6F6" border-style='dashed' />
				</view>
				<!-- 数量 -->
				<view class="number flex flex-wrap-w flex-jc-sb font-24">
					<view class="number-main mgb-20">
						<view class="font-32 fwb">{{item2.andCustomerNumber}}</view>
						<view>总客户数</view>
					</view>
					<view class="number-main mgb-20">
						<view class="font-32 fwb">{{item2.addMoney}}</view>
						<view>流入核销金额</view>
					</view>
					<view class="number-main mgb-20">
						<view class="font-32 fwb">{{item2.lossMoney}}</view>
						<view>流出核销金额</view>
					</view>
				</view>
			
				<view class="flex flex-wrap-w flex-jc-sb font-24" style="margin: 0 14rpx;">
					<view class="number-main">
						<view class="font-32 fwb">{{item2.theCardSales}}</view>
						<view>月卡销售量</view>
					</view>
					<view class="number-main">
						<view class="font-32 fwb">{{item2.timeCardSales}}</view>
						<view>次卡销售量</view>
					</view>
					<view class="number-main">
						<view class="font-32 fwb">{{item2.clockSales}}</view>
						<view>计时卡销售量</view>
					</view>
					<view class="number-main">
						<view class="font-32 fwb">{{item2.topupSales}}</view>
						<view>充值卡销售量</view>
					</view>
				</view>
			</view>
		</view>
		<view v-if="list.length!==1" @click="change(index)" class="flex flex-jc-c" style="margin-top: 20rpx;margin-bottom: 15rpx;">
			<view style="text-align: center;border-radius: 20rpx;width: 110rpx;height: 40rpx;background-color: #F4F4F4;">
				<u-icon :name="title" size="30rpx" color="#999999"></u-icon>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			list: {
				type: [Array, Object],
				default: () => []
			},
			startDate:{
				type: String,
				default: ''
			},
			endDate:{
				type: String,
				default: ''
			},
			index:{
				type:Number,
				default:0
			}
		},
		data() {
			return {
				isMore:false
			}
		},
		filters: {
		  million(value) { //过万处理
		    let num
		    num = Number(value).toFixed(2)
		    return num
		  }
		},
		computed:{
			showList() {
			  if (this.isMore === false) { //当数据不需要完全显示的时候
			    var showList = [] //定义一个空数组
			    if (this.list.length > 1) { //这里我们先显示前三个
			      for (var i = 0; i < 1; i++) {
			        showList.push(this.list[i])
			      }
			    } else {
			      showList = this.list
			    }
			    return showList //返回当前数组
			  } else {
			    return this.list
			  }
			},
			title() {
			  if (this.isMore === false) { //对文字进行处理
			    return 'arrow-down'
			  } else {
			    return 'arrow-up'
			  }
			}
		},
		methods:{
			change(e){
				this.isMore = !this.isMore
				// this.$emit('change',e)
			},
		}
	}
</script>

<style lang="scss">
	@import  '../report_form.scss';
</style>
